Skip to content

feat: react-native-reanimated as peer dependency#4912

Open
wonderlul wants to merge 5 commits intocallstack:v6from
wonderlul:feat/Reanimated-v6
Open

feat: react-native-reanimated as peer dependency#4912
wonderlul wants to merge 5 commits intocallstack:v6from
wonderlul:feat/Reanimated-v6

Conversation

@wonderlul
Copy link
Copy Markdown
Collaborator

Motivation

react-native-reanimated (v4) is the intended path for animated Paper components. Today the library still uses React Native’s built-in Animated API everywhere; this PR does not migrate any UI yet. It only declares the new peer dependencies so consumers install compatible versions up front, and so maintainers can add Reanimated-based animations in follow-up PRs without changing the public dependency contract again.

Reanimated 4 depends on react-native-worklets, so both packages are added as peers (and as dev dependencies for local development, type-checking, and tests).

@callstack-bot
Copy link
Copy Markdown

callstack-bot commented May 4, 2026

Hey @wonderlul, thank you for your pull request 🤗. The documentation from this branch can be viewed here.

Copy link
Copy Markdown
Collaborator

@adrcotfas adrcotfas left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

example/package.json uses reanimated and worklets entries but older versions. We should bump those too or use * to avoid maintenance.

Comment thread package.json
"react-native-safe-area-context": "*"
"react-native-reanimated": ">=4.3.0",
"react-native-safe-area-context": "*",
"react-native-worklets": ">=0.8.1"
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just a comment, not necessarily requesting changes as I'm not sure about best practices for devDependencies vs peerDependencies but reanimated 4.3.0's own peer dep is react-native-worklets: 0.8.x. This would allow react-native-worklets: 0.9.0 even though reanimated would reject it.

Copy link
Copy Markdown
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not quite sure here as well. I think Paper should only states minimums; Reanimated’s own peerDependencies and the app’s lockfile are where compatible worklets / Reanimated pairings are enforced.

Comment thread testSetup.js Outdated
jest.mock('react-native-safe-area-context', () => mockSafeAreaContext);

jest.mock('react-native-worklets', () =>
require('react-native-worklets/src/mock')
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I suggest react-native-worklets/lib/module/mock instead like reanimated uses too in their source code. It's the same artifact runtime code uses, so it doesn't depend on a working TS transform pipeline at test time.

Comment thread jestSetupAfterEnv.js Outdated
@@ -0,0 +1 @@
require('react-native-reanimated').setUpTests();
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I suggest converting to ESM with a named import so this file matches testSetup.js (the sibling jest setup file already uses import):

 import { setUpTests } from 'react-native-reanimated';                                                                                                                                            
                                                       
 setUpTests();

Comment thread docs/docs/guides/01-getting-started.md Outdated
```

:::note
If you're using a bare React Native project (not Expo), you need to add `react-native-worklets/plugin` to your `babel.config.js` plugins array. See the [Reanimated installation guide](https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/getting-started/) for details.
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A comment from Claude:

Two problems with the original wording.

Structural: the plugin instruction was inside a :::note block, which reads as "supplemental info you can skip." But this plugin is mandatory; without it, worklets fails at runtime with confusing errors. Required setup belongs in the install steps, not in a sidebar.

Factual: the original implied Expo users skip this. Reanimated v4 / worklets v0.8 require the babel plugin regardless of toolchain. The safe wording is "required for both Expo and bare React Native" rather than guessing per setup.

@wonderlul wonderlul requested a review from adrcotfas May 7, 2026 10:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants